<template>
	<view class="map-location-container">
		<image class="main-img" :src="api_host + invitaInfo.substance" mode="widthFix" @load="loadImg">
		</image>
		<view class="footer">
			<button type="default" class="footer-btn" :class="invitaInfo.isEnroll === 1 ? 'is-apply': ''"
				@tap="handlePay"
				:disabled="invitaInfo.isEnroll === 1">{{ invitaInfo.isEnroll === 1 ? '已报名': '活动报名'  }}</button>
		</view>

	</view>
</template>

<script>
	import {
		activityInfo
	} from '@/common/api_invitation.js'


	export default {
		name: '',
		data() {
			return {
				show: false,
				invitaInfo: {},

				radiolist1: [{
					name: '否',
					value: 0
				},{
					name: '是',
					value: 1
				}]
			}
		},
		onLoad() {
			this.getInvitationData()
		},
		
		methods: {
			handlePay() {
				uni.navigateTo({
					url: '/subpage/invitation/activityform'
				})
			},
			async getInvitationData() {
				uni.showLoading({
					mask: true
				})
				const inviData = await activityInfo()
				console.log(inviData, 'inviData')
				uni.hideLoading()
				if (inviData.code === 200) {
					this.invitaInfo = inviData.data
				}
				
			},
			loadImg() {
				uni.hideLoading()
			},
		}

	}
</script>

<style lang="scss" scoped>
	.map-location-container {
		width: 100%;
		min-height: 100vh;
		// padding-bottom: 40rpx;
		background-color: #fff;

		.main-img {
			width: 100% !important;
			// min-height: 100vh;
		}

		.footer-btn {
			position: fixed;
			left: 50%;
			bottom: 40rpx;
			width: 70%;
			margin: 0 auto;
			transform: translateX(-50%);
			font-weight: 600;
			border-radius: 16rpx;
			color: #fff;
			background-color: #2878ff;
			z-index: 999;

			&.is-apply {
				background-color: #f7f7f7;
				color: rgba(0, 0, 0, .3);
			}

			&::after {
				border: 0;
			}

		}

		.nav-btn {
			position: fixed;
			left: 5%;
			bottom: 40rpx;
			width: 20%;
			margin: 0 auto;
			font-weight: 600;
			border-radius: 16rpx;
			color: #fff;
			background-color: #2878ff;
			z-index: 999;

			&::after {
				border: 0;
			}

		}


	}

	/deep/ .u-form {
		width: 640rpx;
		padding: 32rpx 40rpx;
		box-sizing: border-box;
	}
	
	// /deep/ .u-form-item__body__left__content__label {
	// 	position: relative;
	// 	&::after {
	// 		position: absolute;
	// 		top: 0;
	// 		left: 0;
	// 		color: red;
	// 		content: '*';
	// 	}
	// }

	// /deep/.u-button.u-primary {
	// 	margin-bottom: 12rpx;
	// }
</style>